<template>
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
      <!-- Content Header (Page header) -->
      <section class="content-header">
        <h1>
          客户管理
        </h1>

        <ol class="breadcrumb">
          <li><a href="#"> 控制台</a></li>
          <li><a href="#">客户订单</a></li>
          <li class="active">详情</li>
        </ol>
      </section>

      <!-- Main content -->
      <section class="content">
          <div class="row">
            <div class="col-xs-12">
                <div class="box box-solid">
                  <div class="box-header with-border">
                    <h3 class="box-title">订单信息</h3>
                  </div>
                  <!-- /.box-header -->
                  <!-- form start -->
                  <form class="form-horizontal">
                    <div class="box-body">

                      <div class="form-group">
                        <label  class="col-sm-2 control-label">订单编号</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.order_id">
                        </div>

                        <label  class="col-sm-2 control-label">下单时间</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.order_date">
                        </div>
                      </div>

                      <div class="form-group">
                        <label  class="col-sm-2 control-label">状态</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.status">
                        </div>

                        <label  class="col-sm-2 control-label">总金额</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.total_amount">
                        </div>
                      </div>
                      <div class="form-group">
                        <label  class="col-sm-2 control-label">收获地址</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.address">
                        </div>
                        <label  class="col-sm-2 control-label">收货人</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.consignee">
                        </div>
                      </div>
                      <div class="form-group">
                        <label  class="col-sm-2 control-label">联系电话</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.mobile">
                        </div>
                        <label  class="col-sm-2 control-label">备注</label>
                        <div class="col-sm-4">
                          <input class="form-control" readonly :value="model.remark">
                        </div>
                      </div>

                    </div>
                    <!-- /.box-body -->
                  </form>
                </div>
              <!-- /.box -->
            </div>
          </div>


          <div class="row">
            <div class="col-xs-12">
                <div class="box box-solid">
                    <div class="box-header with-border">
                      <h3 class="box-title">商品条目</h3>
                    </div>
                  <!-- /.box-header -->
                  <!-- form start -->

                  <div class="box-body table-responsive no-padding">

                    <table class="table table-bordered table-hover">
                      <thead>
                      <tr>
                        <th>商品名称</th>
                        <th>单价</th>
                        <th>购买数量</th>
                        <th>金额</th>
                      </tr>
                      </thead>
                      <tbody>
                      <tr v-for="item in order_item_list" :id="'row_'+item.id">
                        <td>{{item.name}}</td>
                        <td>{{item.price}}</td>
                        <td>{{item.buy_count}}</td>
                        <td>{{item.amount}}</td>
                      </tr>
                      </tbody>
                    </table>
                  </div>
                  <!-- /.box-body -->
                  <div class="box-footer clearfix">

                  </div>

                </div>
              <!-- /.box -->
            </div>
          </div>




      </section>
      <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
</template>

<script>
import Order from '@/modules/Order'
import OrderItem from '@/modules/OrderItem'

export default {

    mounted() {
        this.loadModel();
    },

    data() {
        return {
            model:{},

            //客户等级列表
            order_item_list:[],
        };
    },

    methods: {
        loadModel() {
            if(this.$route.params.id > 0){
                Order.show(this.$route.params.id)
                .then((response) => {
                    this.model = response.contents;
                });
                OrderItem.list({order_id:this.$route.params.id},false)
                .then((response) => {
                    this.order_item_list = response.contents;
                });
            }
        }
    },

    computed:{

    }
}
</script>

<style lang="css">
</style>
